{extend name="public/base" /}
{block name="css"}
<style>

  .menu {
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: #959697;
  }

  .active {
    color: #000000;
  }

  .about-content {
    flex: .7;
    background-image: url('https://ujia-img.oss-cn-shenzhen.aliyuncs.com/changehome/about/mobile/YDbj.png');
    background-size: cover;
    padding-bottom: 60px;
  }

  .contact-content {
    display: none;
  }

</style>
{/block}
{block name="main"}
<section class="container-fluid">
  <img class="img-fluid" src="https://ujia-img.oss-cn-shenzhen.aliyuncs.com/beauthome/about/mobile/banner.png">

  <img class="img-fluid" src="https://ujia-img.oss-cn-shenzhen.aliyuncs.com/beauthome/about/mobile/brand.png" style="margin-top: 30px">

  <img class="img-fluid" src="https://ujia-img.oss-cn-shenzhen.aliyuncs.com/beauthome/about/mobile/intention.png" style="margin-top: 30px">

  <div class="d-flex flex-column mx-auto" style="padding: 0 10px">
    <img class="img-fluid" src="https://ujia-img.oss-cn-shenzhen.aliyuncs.com/beauthome/about/mobile/gc.png" style="margin-top: 20px">
  </div>

  <img class="img-fluid" src="https://ujia-img.oss-cn-shenzhen.aliyuncs.com/beauthome/about/mobile/P2.png" style="margin-top: 30px">

  <div class="d-flex flex-column mx-auto" style="padding: 0 10px">
    <img class="img-fluid" src="https://ujia-img.oss-cn-shenzhen.aliyuncs.com/beauthome/about/mobile/szh.png" style="margin-top: 30px">
  </div>

  <div class="d-flex flex-column mx-auto" style="margin-top: 30px;background:#F4F5F6;padding: 0 10px 30px">
    <img class="img-fluid" src="https://ujia-img.oss-cn-shenzhen.aliyuncs.com/beauthome/about/mobile/pp.png">
  </div>

</section>
{/block}
{block name="js"}
<script>
  $('#nav').find('ul > li').eq(6).addClass('nav-active');
  $("#nav").scrollLeft(65*6);
</script>
{/block}